import React from 'react'
import classNames from 'classnames'
import { type ButtonProps } from './types'

/**
 * 页面中最常用的按钮元素, 适用于完成特定的交互,支持 HTML button 和 a 链接的所有属性
 * ### 引用方法
 * ```js
 * import { Button } from 'react18-antd'
 * ```
 * @param props
 * @returns
 */
export const Button: React.FC<ButtonProps> = (props) => {
	const { btnType, className, disabled, size, children, href, ...restProps } =
		props
	// btn, btn-lg, btn-primary

	const classes = classNames('btn', className, {
		[`btn-${btnType}`]: btnType,
		[`btn-${size}`]: size,
		disabled: btnType === 'link' && disabled
	})

	if (btnType === 'link' && href) {
		return (
			<a className={classes} href={href} {...restProps}>
				{children}
			</a>
		)
	}
	return (
		<button className={classes} disabled={disabled} {...restProps}>
			{children}
		</button>
	)
}

Button.defaultProps = {
	disabled: false,
	btnType: 'default'
}

export default Button
